<!--
 * @Description: 
 * @Author: DHL
 * @Date: 2022-08-03 09:53:53
 * @LastEditors: DHL
 * @LastEditTime: 2022-09-07 16:16:25
-->
<template>
  <bpmnDesigner ref="bpmnDesignerRef" @save="handleSave"></bpmnDesigner>
</template>

<script setup lang="ts">
  import 'bpmn-js/dist/assets/diagram-js.css'
  import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
  import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'

  import 'bpmn-js-token-simulation/assets/css/bpmn-js-token-simulation.css'
  import 'diagram-js-minimap/assets/diagram-js-minimap.css'

  import './src/theme/process-designer.scss'

  import bpmnDesigner from './src/index.vue'

  const emit = defineEmits(['save'])

  const bpmnDesignerRef = ref()

  //////////////////////////////////////////////////
  // 函数
  //////////////////////////////////////////////////

  /**
   * 初始化
   */
  function handleInit(modelData: any) {
    bpmnDesignerRef.value.handleInit(modelData)
  }

  /**
   * 保存模型
   */
  function handleSave(saveParams: any) {
    emit('save', saveParams)
  }

  //////////////////////////////////////////////////
  // 暴露出去，父组件才可以调用到
  //////////////////////////////////////////////////

  defineExpose({
    handleInit
  })
</script>

<style scoped lang="scss"></style>
